<template>
    <div class="followUp-view">
        <el-dialog title="报备客户跟进" :visible.sync="dialogFormVisible" width="10%" :show-close="showimg"  :close-on-click-modal="showimg">
            <div class="followUp-view-dialog">
                <div class="followUp-content-title">经纪人信息</div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list">
                        <div>姓名：{{clientMsg.agentName}}</div>
                        <div>所在片区：{{clientMsg.majorRegion}}</div>
                    </div>
                    <div class="followUp-content-content-list">
                        <div>经纪人电话：{{clientMsg.agentMobile}}</div>
                        <div>所属组织：{{clientMsg.institutionName}}</div>
                    </div>
                    <div class="followUp-content-content-list">
                        <div>所在城市：{{clientMsg.majorRegion}}</div>
                    </div>
                </div>
                <div class="followUp-content-title">到访信息</div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list">
                        <div>楼盘名称：{{clientMsg.houseName}}</div>
                    </div>
                    <div class="followUp-content-content-list">
                        <div>楼盘均价：{{clientMsg.avgPrice}}</div>
                    </div>
                    <div class="followUp-content-content-list">
                        <div>所在城市：{{clientMsg.houseCityName}}</div>
                    </div>
                </div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list1">
                        <div>跟进人：</div>
                        <div class="content-input">
                            <el-input v-model="value1" placeholder="输入跟进人"></el-input>
                        </div>
                    </div>
                    <div class="followUp-content-content-list1">
                        <div>跟进人电话：</div>
                        <div class="content-input1">
                            <el-input v-model="value2" placeholder="输入跟进人电话"></el-input>
                        </div>
                    </div>
                </div>
                <div class="followUp-content-title">客户信息</div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list">
                        <div>客户编号：{{clientMsg.clientId}}</div>
                    </div>
                    <div class="followUp-content-content-list">
                        <div>客户姓名：{{clientMsg.clientName}}</div>
                    </div>
                    <div class="followUp-content-content-list">
                        <div>客户电话：{{clientMsg.clientTel}}</div>
                    </div>
                </div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list">
                        <div>客户类别：线上</div>
                    </div>
                </div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list1">
                        <div>报备状态：</div>
                        <div >
                            <el-select class="content-option" v-model="value3" placeholder="请选择">
                                <el-option
                                        v-for="item in options"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                </div>
                <div class="followUp-content-title">到访结果</div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list1">
                        <el-radio class="content-radio" v-model="value4" label="1">未到访</el-radio>
                        <el-radio class="content-radio" v-model="value4" label="2">到访有效</el-radio>
                        <el-radio class="content-radio" v-model="value4" label="3">到访无效</el-radio>
                        <div>到访时间：</div>
                        <div >
                            <el-date-picker
                                    class="content-option"
                                    v-model="value5"
                                    type="date"
                                    placeholder="选择日期">
                            </el-date-picker>
                        </div>
                    </div>
                </div>
                <div class="followUp-content-title">客单登记</div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list1">
                        <el-radio class="content-radio" v-model="value6" label="1">待跟进</el-radio>
                        <el-radio class="content-radio" v-model="value6" label="2">已认筹</el-radio>
                        <el-radio class="content-radio" v-model="value6" label="3">已认购</el-radio>
                        <el-radio class="content-radio" v-model="value6" label="4">已签约</el-radio>
                        <el-radio class="content-radio" v-model="value6" label="5">已结佣</el-radio>
                        <el-radio class="content-radio" v-model="value6" label="6">已放弃</el-radio>
                    </div>
                </div>
                <div class="followUp-content-content">
                    <div class="followUp-content-content-list1">
                        <div>时间：</div>
                        <div >
                            <el-date-picker
                                    class="content-option"
                                    v-model="value7"
                                    type="date"
                                    placeholder="选择时间">
                            </el-date-picker>
                        </div>
                    </div>
                </div>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button class="cancel-button"  @click="closeFormrole" >取 消</el-button>
                <el-button class="sure-button" type="primary" @click="addstruct">保 存</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
    export default {
        name: "followUp",
        data(){
            return{
                showimg:false,
                clientMsg:{},
                value1:"",
                value2:"",
                value3:"",
                value4:1,
                value5:"",
                value6:1,
                value7:"",
                options: [{
                    value: '0',
                    label: '待确认'
                }, {
                    value: '1',
                    label: '报备成功'
                }, {
                    value: '2',
                    label: '报备失败'
                }, {
                    value: '3',
                    label: '审核中'
                }],
            }
        },
        props:{
            seeDetails:{
                type:Object,
            },
            dialogFormVisible: {
                type: Boolean
            },
        },
        watch: {
            seeDetails:{
                handler(newValue, oldValue) {
                   this.clientMsg=newValue
                   console.log(this.clientMsg,"?????????")
                }
            },
        },
        mounted(){
            console.log(this.clientMsg,"?????????")
        },
        methods: {

            closeFormrole() {
                console.log("aaaaaaa")
                this.$emit("close");
            },
            addstruct(){
                let _this = this;
                console.log(">>>>>>",_this.treerole)
                let params={
                    follower:this.value1,//跟进人
                    followerTel:this.value2,//跟进电话
                    reportSts:this.value3,//报备状态
                    result:this.value4,//到访结果
                    arriveTime:this.value5,//到访时间
                    transferSts:this.value6,//客单登记结果
                    reportTime:this.value7,//客单登记时间
                }
                console.log(params,">>>>>>>>>>>>>")
                _this.Api.setting.updateClientInfo(params).then((data)=>{
                    console.log("成功",data)
                    this.closeFormrole()
                })
            }
        }
    }
</script>
<style>
    .followUp-view .el-dialog--small {
        width:696px;
    }
    .followUp-view .el-form-item__label {
        text-align: right;
        vertical-align: middle;
        float: left;
        font-size: 14px;
        font-family:PingFangSC-Regular;
        font-weight:400;
        color:rgba(0,0,0,0.85);
        line-height:22px;
        padding: 7px 0px 0px 30px;
        box-sizing: border-box;
    }
    .followUp-view  .el-dialog__header{
        height: 50px;
        padding: 10px ;
        text-align: left;
        font-size:16px;
        font-family:PingFangSC-Medium;
        font-weight:500;
        color:rgba(0,0,0,0.85);
        line-height:24px;

    }
    .followUp-view .el-dialog__body{
        border-top: 1px #E9E9E9 solid;
        border-bottom: 1px #E9E9E9 solid;
    }
</style>
<style scoped rel="stylesheet/scss" lang="scss">
.followUp-view{
    .followUp-view-dialog{
        .followUp-content-title{
            font-size:16px;
            font-family:PingFangSC-Medium;
            font-weight:500;
            color:rgba(0,0,0,0.85);
            line-height:24px;
            margin-bottom: 16px;
            margin-top: 23px;
        }
        .followUp-content-content{
            display: flex;
            .followUp-content-content-list{
                width: 33.33%;
                font-size:14px;
                font-family:PingFangSC-Regular;
                font-weight:400;
                color:rgba(0,0,0,0.85);
                line-height:22px;
                div{
                    margin-bottom: 8px;
                }
            }
            .followUp-content-content-list1{
                font-size:14px;
                font-family:PingFangSC-Regular;
                font-weight:400;
                color:rgba(0,0,0,0.85);
                line-height:32px;
                display: flex;
                margin-right: 52px;
                margin-top: 8px;
                .content-input{
                    width:109px;
                    height:32px;
                    background:rgba(255,255,255,1);
                    border-radius:4px;
                }
                .content-input1{
                    width:152px;
                    height:32px;
                    background:rgba(255,255,255,1);
                    border-radius:4px;
                }
                .content-option{
                    width:152px;
                    height:32px;
                    background:rgba(255,255,255,1);
                    border-radius:4px;
                }
                .content-radio{
                    font-size:14px;
                    font-family:PingFangSC-Regular;
                    font-weight:400;
                    color:rgba(0,0,0,0.65);
                    line-height:32px;
                    margin-right: 30px;
                }
                div{
                    margin-bottom: 8px;
                }
            }
        }
    }
}
</style>